
//各学院预警人数1
let warnFacuData = [];
let warnFacuKey = [];
let option_college1 = {
    grid: {
        left: '10',
        top: '5',
        right: '25',
        bottom: '0%',
        containLabel: true
    },
    dataZoom: [
        {
            yAxisIndex: 0,// 这里是从X轴的0刻度开始
            show: true, // 是否显示滑动条，不影响使用
            type: "slider", // 这个 dataZoom 组件是 slider 型 dataZoom 组件
            width: 10, // 表示滚动条的高度，也就是粗细
            startValue: 0, // 从头开始。
            endValue: 5, // 一次性展示多少个。
            left:0,
            handleSize:'0px',
            handleStyle:{
                color: "#3AAAF0",
                borderColor: "#007acc",
            },
            fillerColor: 'rgba(27, 102, 177, 1)',
            backgroundColor: "rgba(4, 28, 52, 1)",
            showDetail:true,
            borderColor: '#002944'
        },
    ],
    xAxis: {
        show: false
    },
    yAxis: [{
        show: true,
        data: warnFacuKey,
        inverse: true,
        axisLine: {show: false},
        splitLine: {show: false},
        axisTick: {show: false},
        axisLabel: {
            textStyle: {
                color: '#fff'
            },
        },
    }],
    series: [{
        name: '条',
        type: 'bar',
        yAxisIndex: 0,
        data: warnFacuData,
        barWidth: 17,
        itemStyle: {
            normal: {
                barBorderRadius: 50,
                color: '#1089E7',
            }
        },
        label: {
            normal: {
                show: true,
                position: 'right',
                formatter: '{c}',
                textStyle: {color: 'rgba(255,255,255,.5)'}
            }
        },
    }]
};
//年级比例
let gradeKey = [];
let gradeData = [];
let option_prop1 = {
    legend: {
        show: true,
        orient: 'vertical',
        itemWidth: 10,
        itemHeight: 10,
        textStyle: {
            color: 'rgba(255,255,255,.5)'
        },
        top: '10%',
        right: 30,
        data: gradeKey
    },
    color: ['#37a2da', '#32c5e9', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378ea'],
    tooltip: {
        trigger: 'item',
        formatter: "{b} : {c} ({d}%)"
    },
    calculable: true,
    series: [
        {

            type: 'pie',
            radius: [30, "55%"],
            center: ["35%", "50%"],
            roseType: 'area',
            data: gradeData,
            label: {
                normal: {
                    formatter: function (param) {
                        return param.name + ':\n' + param.value + '\n';
                    }

                }
            },
            labelLine: {
                normal: {
                    length: 5,
                    length2: 15,
                    lineStyle: {width: 1}
                }
            },

            itemStyle: {
                normal: {
                    shadowBlur: 30,
                    shadowColor: 'rgba(0, 0, 0, 0.4)'
                }

            },
        }
    ]
};
//专业比例
let facultyData = [];
let facultyKey = [];
let option_prop2 = {
    legend: {
        show:true,
        // type: "scroll",
        orient: "vertical",
        width:'50%',
        height:'30%',
        right: 20,
        top: 10,
        bottom: 10,
        // pageButtonPosition: 'end',
        // pageIconColor: "white",//激活的分页按钮颜色
        // pageIconInactiveColor: "#2f4554",//没激活的分页按钮颜色
        itemWidth: 10,
        itemHeight: 10,
        textStyle:{
            color:'rgb(230,239,239)'
        },
        data:facultyData,

    },
    color: ['#a5d5b6','#bfbadc','#37a2da','#32c5e9','#9fe6b8','#ffdb5c','#ff9f7f','#fb7293','#e7bcf3'],
    tooltip : {
        trigger: 'item',
        formatter: "{b} : {c} ({d}%)"
    },
    calculable : true,
    series : [
        {
            type:'pie',
            radius : [30, "65%"],
            center: ["45%", "60%"],
            roseType : 'radius',
            minShowLabelAngle:50,
            data:facultyData,
            label: {
                show:false
                // position:'inside',
                // formatter: function (param){
                //     return param.name +': '+ (param.value - number) + ' ' + (((param.value - number) / sum) * 100).toFixed(2) + '%'
                // }
                // formatter: function(param) {
                //     var num = Math.random()
                //     return num>0.4? param.name +':\n' + param.value +'\n': '';
                // }
            },
            labelLine: {
                show:false,
                normal: {
                    length:5,
                    length2:15,
                    lineStyle: { width: 1}
                }
            },
            itemStyle: {
                normal: {
                    shadowBlur: 30,
                    shadowColor: 'rgba(0, 0, 0, 0.4)'
                }

            },
        }
    ]
};
//性别比例
let sexData = []
let option_prop3 = {
    legend: {
        orient: 'vertical',
        itemWidth: 10,
        itemHeight: 10,
        textStyle:{
            color:'rgba(255,255,255,.5)'
        },
        top:'10%',
        right:30,
        data:['女','男']
    },
    color: ['#37a2da','#fb7293','#e7bcf3','#8378ea'],
    tooltip : {
        trigger: 'item',
        formatter: "{b} : {c} ({d}%)"
    },

    calculable : true,
    series : [
        {

            type:'pie',
            radius : [30, "50%"],
            center: ["35%", "45%"],
            // roseType : 'area',
            data:sexData,
            label: {
                normal: {
                    formatter: function(param) {
                        return param.name +':\n' + param.value +'\n';
                    }

                }
            },
            labelLine: {
                normal: {
                    length:5,
                    length2:15,
                    lineStyle: { width: 1}
                }
            },

            itemStyle: {
                normal: {
                    shadowBlur: 30,
                    shadowColor: 'rgba(0, 0, 0, 0.4)'
                }

            },
        }
    ]
};
//趋势折线图
let warningData = []
let warningKey = []
let warningValue = []
let intervenrValue = []
$.ajax({
    url:'/tbIndicators/warningIntervene',
    type: 'GET',
    contentType:"application/json",
    async:false,
    success:function (data){
        intervenrValue = Object.values(data)
    }
})

let dataText = [
    {
    name: '预警人数',
    type: 'line',
    smooth: true,
    symbolSize: 8,
    data: warningValue,
    barWidth: '30%',
}, {
    name: '干预人数',
    type: 'line',
    smooth: true,
    symbolSize: 8,
    data: intervenrValue,
    barWidth: '30%',
}
]
let dataObj = {
    year: warningKey,
    data: {
        value: [{
            name: '预警人数',
            value: warningValue
        }, {
            name: '干预人数',
            value: intervenrValue
        }
        ]
    }
}
let dataArr = []
dataObj.data.value.map(item => {
    let newArr = {
        name: item.name,
        type: 'line',
        smooth: true,
        symbolSize: 8,
        data: item.value,
        barWidth: '30%',
        itemStyle: {
            normal: {
                color: item.name === '预警人数' ? '#f0c725' : item.name === '干预人数' ? '#0BE3FF' : '#16f892'
            }
        },
        areaStyle: {
            normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                    offset: 0,
                    color: item.name === '预警人数' ? '#f0c725' : item.name === '干预人数' ? '#0BE3FF' : '#16f892'
                }, {
                    offset: 0.8,
                    color: 'rgba(0, 136, 212, 0)'
                }], false),
                shadowColor: 'rgba(0, 0, 0, 0.1)',
                shadowBlur: 10
            }
        },
    }
    dataArr.push(newArr)
})
const option_trend = {
    color: ['#f0c725', '#16f892'],
    title: {
        left: 'center',
        text: '',
        textStyle: {
            color: '#FFFFFF',
            fontSize: '14',
        }
    },
    tooltip: {
        trigger: 'axis',
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    legend: {
        x: 'center',
        top: '25',
        textStyle: {
            color: '#c1cadf',
            "fontSize": 14
        }
    },
    grid: {
        left: '3%',
        right: '6%',
        top: '25%',
        bottom: '3%',
        containLabel: true
    },
    toolbox: {
        show: true,
        orient: 'vertical',
        x: 'right',
        y: 'center'
    },
    xAxis: [{
        type: 'category',
        name: '(年)',
        boundaryGap: false,
        data: dataObj.year,
        axisLine: {
            lineStyle: {
                color: 'rgba(240,199,37,0.5)'
            }
        },
        axisLabel: {
            interval: 0,
            color: '#c1cadf',
            fontSize: '15'
        }
    }],
    yAxis: [{
        type: 'value',
        name: '(人)',
        nameTextStyle: {
            color: '#c1cadf',
            align: 'right',
            lineHeight: 10
        },
        axisLine: {
            lineStyle: {
                color: 'rgba(240,199,37,0.5)'
            }
        },
        axisLabel: {
            interval: 0,
            color: '#c1cadf',
            fontSize: '15'
        },
        splitLine: {
            show: false
        }
    }],
    series: dataArr
}

//六大指标
let radarData = []
let showData =[]

let option_radar = {
    tooltip: {
        trigger: 'axis'
    },
    radar: [{
        indicator: [{
            name: '学业表现',
            max: 5,
        }, {
            name: '社团活跃度',
            max: 5,
        }, {
            name: '身体素质',
            max: 5,
        }, {
            name: '人际关系指数',
            max: 5,
        }, {
            name: '阅读',
            max: 5,
        }, {
            name: '睡眠质量',
            max: 5,
        }],
        center: ['50%', '50%'],
        radius: '80%',
        startAngle: 90,
        splitNumber: 4,
        shape: 'circle',
        name: {
            padding:-5,
            formatter: '{value}',
            textStyle: {
                fontSize: 18, //外圈标签字体大小
                color: 'white' //外圈标签字体颜色
            }
        },
        splitArea: {
            show: true,
            areaStyle: {
                color: 'rgba(255,255,255,.05)'
            }
        },
        axisLabel: {
            show: false,
            fontSize: 20,
            color: "#000",
            fontStyle: "normal",
            fontWeight: "normal"
        },
        axisLine: {
            show: true,
            lineStyle: {
                color: 'rgba(255,255,255,0.5)'
            }
        },
        splitLine: {
            show: true,
            lineStyle: {
                color: 'rgba(255,255,255,0.5)'
            }
        }
    }, ],
    series: [{
        type: 'radar',
        name: '身心指标平均值',
        tooltip: {
            trigger: 'item'
        },
        itemStyle: {
            emphasis: {
                lineStyle: {
                    width: 4
                }
            }
        },
        data: [
            {
                name: '身心指标平均值',
                value: showData,
                symbol: 'circle',
                symbolSize: 12,
                label: {                    // 单个拐点文本的样式设置
                    normal: {
                        show: true,             // 单个拐点文本的样式设置。[ default: false ]
                        position: 'top',        // 标签的位置。[ default: top ]
                        distance: 5,            // 距离图形元素的距离。当 position 为字符描述值（如 'top'、'insideRight'）时候有效。[ default: 5 ]
                        color: 'rgb(153,193,232)',          // 文字的颜色。如果设置为 'auto'，则为视觉映射得到的颜色，如系列色。[ default: "#fff" ]
                        fontSize: 16,           // 文字的字体大小
                        formatter:function(params) {
                            return params.value;
                        }
                    }
                },
                lineStyle: {
                    normal: {
                        color:'#ffdb5c',
                        width:2,
                    }
                },
                areaStyle: {
                    normal: {
                        color: '#ffdb5c',
                        opacity:.3
                    }
                },
                itemStyle: {
                    color:'#f36a6a'
                },
            }
            ]
    }, ]
};